<template>
  <BasicForm @register="registerForm" />
</template>

<script setup lang="ts">
  import { BasicForm, useForm } from '/@/components/Form';
  import { defineProps, onMounted } from 'vue';
  import { FormSchema } from '/@/components/Form/index';
  import { typeList } from './collapse.data';
  import { getEntityAssetList, getEntityDeviceList } from '/@/api/thingsborad/entity/entity';
  import { modalFormStyleSetting } from '/@/settings/thingsBoardDesign';
  const props = defineProps({
    type: {
      type: String,
    },
    list: {
      type: Array,
    },
    deletedList: {
      type: Array,
    },
    currentSelect: {
      type: String,
    },
    mode: {
      type: String,
    },
  });

  const emit = defineEmits(['select']);
  const addSchemas: FormSchema[] = [
    {
      field: 'type',
      label: '类型',
      component: 'Select',
      componentProps: {
        allowClear: false,
        placeholder: '请选择类型',
      },
      required: true,
    },
    {
      field: 'syncStrategy',
      label: '同步策略',
      component: 'Select',
      componentProps: {
        allowClear: false,
        placeholder: '请选择同步策略',
        options: [
          { label: '默认', value: 'default' },
          { label: '合并', value: 'MERGE' },
          { label: '覆盖', value: 'OVERWRITE' },
        ],
      },
      required: true,
      defaultValue: 'default',
    },
    {
      field: 'exportProperties',
      label: '导出属性',
      component: 'Checkbox',
      ifShow: () =>
        !['NOTIFICATION_TEMPLATE', 'NOTIFICATION_TARGET', 'NOTIFICATION_RULE'].some(
          (item) => props.type == item,
        ),
      defaultValue: true,
    },
    {
      field: 'exportAssociations',
      label: '导出关联',
      component: 'Checkbox',
      ifShow: () =>
        !['NOTIFICATION_TEMPLATE', 'NOTIFICATION_TARGET', 'NOTIFICATION_RULE'].some(
          (item) => props.type == item,
        ),
      defaultValue: true,
    },
    {
      field: 'exportCredential',
      label: '导出凭据',
      component: 'Checkbox',
      ifShow: () => props.type == 'DEVICE',
      defaultValue: true,
    },
    {
      field: 'allEntity',
      label: '所有实体',
      component: 'Switch',
      defaultValue: true,
    },
    {
      field: 'entityList',
      label: '实体',
      component: 'ApiSelect',
      componentProps: ({ formModel }) => {
        const { type } = formModel;
        let api: any;
        switch (type) {
          case 'ASSET':
            api = getEntityAssetList;
            break;
          case 'DEVICE':
            api = getEntityDeviceList;
            break;
          case 'ENTITY_VIEW':
            break;
          case 'DASHBOARD':
            break;
          case 'CUSTOMER':
            break;
          case 'DEVICE_PROFILE':
            break;
        }
        return {
          mode: 'multiple',
          listHeight: 160,
          placeholder: '请选择实体',
          api,
          params: {
            page: 0,
            pageSize: 50,
          },
          resultField: 'data',
          labelField: 'name',
          valueField: 'id.id',
          immediate: true,
        };
      },
      required: true,
      ifShow: ({ values }) => {
        return !values.allEntity;
      },
    },
  ];
  const restoreSchemas: FormSchema[] = [
    {
      field: 'type',
      label: '类型',
      component: 'Select',
      componentProps: {
        allowClear: false,
        placeholder: '请选择类型',
      },
      required: true,
    },
    {
      field: 'findExistingEntityByName',
      label: '按名称查找现有实体',
      component: 'Checkbox',
      defaultValue: true,
    },
    {
      field: 'loadAttributes',
      label: '加载属性',
      component: 'Checkbox',
      ifShow: () =>
        !['NOTIFICATION_TEMPLATE', 'NOTIFICATION_TARGET', 'NOTIFICATION_RULE'].some(
          (item) => props.type == item,
        ),
      defaultValue: true,
    },
    {
      field: 'loadCredentials',
      label: '加载凭据',
      component: 'Checkbox',
      ifShow: () => props.type == 'DEVICE',
      defaultValue: true,
    },
    {
      field: 'loadRelations',
      label: '加载关联',
      component: 'Checkbox',
      ifShow: () =>
        !['NOTIFICATION_TEMPLATE', 'NOTIFICATION_TARGET', 'NOTIFICATION_RULE'].some(
          (item) => props.type == item,
        ),
      defaultValue: true,
    },
    {
      field: 'removeOtherEntities',
      label: '删除其他实体',
      component: 'Checkbox',
      defaultValue: false,
    },
  ];

  const [registerForm, { updateSchema, validate, getFieldsValue, resetSchema }] = useForm({
    layout: 'vertical',
    schemas: addSchemas,
    showActionButtonGroup: false,
    ...modalFormStyleSetting,
  });

  const changeList = (isSelect?: Boolean, delList?: any) => {
    updateSchema({
      field: 'type',
      componentProps: {
        allowClear: false,
        placeholder: '类型*',
        listHeight: 160,
        options: typeList?.filter((item: any) => {
          return (
            (isSelect ? delList.includes(item.value) : props.deletedList?.includes(item.value)) ||
            item.value == props.type
          );
        }),
        onChange: (value) => {
          emit('select', props.currentSelect, value);
        },
      },
      defaultValue: props.type,
    });
  };
  onMounted(() => {
    if (props.mode === 'restore') {
      resetSchema(restoreSchemas);
    }
    changeList();
  });
  defineExpose({ changeList, validate, getFieldsValue, type: props.type });
</script>
